import { useState, useRef } from 'react';

function RefComponent() {
    // const ref = useRef(0);
    // const myRef = useRef(null);
    // function handleClick() {
    //     // ref.current = ref.current + 1;
    //     // console.log(ref);

    //     console.log(myRef.current);
    // }

    // const [startTime, setStartTime] = useState<number | null>(null);
    // const [now, setNow] = useState<number | null>(null);
    // const intervalRef = useRef(0);
    // function handleStart() {
    //     setStartTime(Date.now());
    //     setNow(Date.now());
    //     clearInterval(intervalRef.current);
    //     intervalRef.current = setInterval(() => {
    //         setNow(Date.now());
    //     }, 10);
    // }
    // function handleStop() {
    //     clearInterval(intervalRef.current);
    // }
    // let secondsPassed = 0;
    // if (startTime != null && now != null) {
    //     secondsPassed = (now - startTime) / 1000;
    // }
    
    function ListShow(){
        const list = [1,2,3,4,5,6,7,8,9,10];
        return list.map((item,index)=>{
            return <p key={index}>{item}</p>
        })
    }

    return (
        <div>
            <ListShow/>
            
            {/* <div ref={myRef}>1</div> */}
            
            {/* <button onClick={handleClick}>
                点击我！
            </button> */}
           
            {/* <h1>时间过去了： {secondsPassed.toFixed(3)}</h1>
            <button onClick={handleStart}>
                开始
            </button>
            <button onClick={handleStop}>
                停止
            </button> */}
        </div>
    );
}

export default RefComponent;